import { createRouter, createWebHistory } from "vue-router";

// import Home from "../pages/home/Index.vue";
// import Detail from "../pages/detail/Index.vue";
// import命令是同步引入
// import City from "../pages/city/Index.vue";

const router = createRouter({
  history: createWebHistory(),
  routes: [
    {
      path: "/",
      redirect: "/home",
    },
    {
      path: "/home",
      component: () => import("../pages/home/Index.vue"),
      children: [
        // 二级重定向
        {
          path: "/home",
          redirect: "/home/movies",
        },
        {
          path: "movies",
          component: () => import("../pages/home/movies/Index.vue"),
          children: [
            {
              path: "/home/movies",
              redirect: "/home/movies/hot",
            },
            {
              path: "hot",
              component: () => import("../pages/home/movies/hot/Index.vue"),
              meta: {
                isKeepAlive: true,
              },
            },
            {
              path: "cinema",
              component: () => import("../pages/home/movies/cinema/Index.vue"),
              meta: {
                isKeepAlive: true,
              },
            },
            {
              path: "wait",
              component: () => import("../pages/home/movies/wait/Index.vue"),
              meta: {
                isKeepAlive: true,
              },
            },
            {
              path: "classic",
              component: () => import("../pages/home/movies/classic/Index.vue"),
              meta: {
                isKeepAlive: false,
              },
            },
          ],
        },
        {
          path: "videos",
          component: () => import("../pages/home/videos/Index.vue"),
          meta: {
            title: "猫眼视频",
          },
        },
        {
          path: "mini",
          component: () => import("../pages/home/mini/Index.vue"),
          meta: {
            title: "猫眼小视频",
          },
        },
        {
          path: "show",
          component: () => import("../pages/home/show/Index.vue"),
          meta: {
            isRequiredLogin: true,
            title: "猫眼演出",
          },
        },
        {
          path: "mine",
          component: () => import("../pages/home/mine/Index.vue"),
          // 路由元信息,里面可以添加任意内容
          meta: {
            isRequiredLogin: true,
            title: "我的猫眼",
          },
          // 路由独享守卫
          // 只守卫自己路由的前置守卫
          // beforeEnter: (to, from, next) => {
          //   if (localStorage.getItem("token")) {
          //     next();
          //   } else {
          //     next("/home");
          //   }
          // },
        },
      ],
    },
    {
      path: "/detail/:id",
      component: () => import("../pages/detail/Index.vue"),
      props: true,
    },
    {
      path: "/city",
      // import函数叫做异步引入
      // 可以用作组件的按需引入
      component: () => import("../pages/city/Index.vue"),
    },
    {
      path: "/:pathMatch(.*)*",
      component: () => import("../pages/notFound/Index.vue"),
    },
  ],
  // 滚动行为
  scrollBehavior(to, from, savedPosition) {
    // return 期望滚动到哪个的位置
    // return { top: 0 };

    // savedPosition只有在点击浏览器前进后退的时候有用
    if (savedPosition) {
      return savedPosition;
    } else {
      return { top: 0 };
    }
  },
});

// 全局前置守卫
// 每一次路由改变的时候都会被调用的
router.beforeEach((to, from, next) => {
  // to和from分别表示要去的和来自的那个页面的路由信息
  // 有第三个参数是next函数，表示的是放行
  // console.log(to);

  // 路由鉴权
  // if (to.path === "/home/mine") {
  //   if (!localStorage.getItem("token")) {
  //     return "/home";
  //   }
  // }

  if (to.meta.isRequiredLogin) {
    if (localStorage.getItem("token")) {
      next();
    } else {
      next("/home");
    }
  } else {
    next();
  }
  // next()表示放行
  // next(false)表示不放行
  // next(路径)表示重定向
});

// 全局解析守卫
// 作用和语法和全局前置守卫完全相同
// 执行的时机会比全局前置守卫稍微慢一些
// router.beforeResolve((to, from, next) => {})

// 全局后置钩子
router.afterEach((to, from) => {
  // 因为没有第三个参数next，所以不能去拦截路由
  // 修改标题
  document.title = to.meta.title || "猫眼电影 | 娱乐看猫眼";
});

export default router;
